<template>
	<div class="base-info-content">
		<el-form ref="ruleFormRef" :model="goodsInfoData" :rules="rules" label-width="150px">
			<el-form-item label="商品协议：">
				<el-select placeholder="请选择商品协议" class="width420">
                    <el-option v-for="item of state.freightTemplateList" :label="item.name" :value="item.id" :key="item.brandId" />
                </el-select>&emsp;
			</el-form-item>
		</el-form>
		<section style="text-align: center; margin: 50px 0;">
			<el-button type="primary" size="large" @click="previousStep">上一步</el-button>
			<el-button type="primary" size="large" @click="nextStep(ruleFormRef)">提交</el-button>
		</section>
	</div>
</template>

<script setup lang="ts" name="funWangEditor">
import { reactive,ref,onMounted} from 'vue';
import { goodsInfo } from '/@/stores/goods';
import { ElMessage } from 'element-plus';
import { freightTemplateList } from "/@/api/common";
const goodsInfoData = goodsInfo()
const emit = defineEmits(['stepChange','submitFun'])
const ruleFormRef = ref<FormInstance>()
// 定义父组件传过来的值
const props = defineProps({
	// 会员列表
	membershipList: {
		type: Array,
	},
	// 付费会员列表
	paymembershipList: {
		type: Array,
	},
});

const state = reactive({
	// 运费模板列表
	freightTemplateList: [] as Array<any>,
})
const rules = reactive<FormRules<any>>({
	memberDiscount: [{ required: true, message: '请选择会员折扣类型', trigger: 'change' }],
	paidmemberDiscount: [{ required: true, message: '请选择付费会员折扣类型', trigger: 'change' }],
})

const memberDiscountTypeChangeFun = (val:any) => {
	if(val == 2){
		//  根据当前会员等级生成会员积分数据
		if(goodsInfoData.skuList.length > 0 && props.membershipList.length > 0){
			goodsInfoData.skuList.map((item:any) => {
				let data = {};
				props.membershipList.map((item:any) =>{
					data[`memberDiscountItem${item.dictValue}`] = 1; //积分值
					data[`memberDiscountItem${item.dictValue}Type`] = 1;  //积分值类型
				})
				item.memberDiscountData = data;
			})
		}
	}
}

const paidMemberDiscountTypeChangeFun = (val:any) => {
	if(val == 2){
		//  根据当前付费会员等级生成会员积分数据
		if(goodsInfoData.skuList.length > 0 && props.paymembershipList.length > 0){
			goodsInfoData.skuList.map((item:any) => {
				let data = {};
				props.paymembershipList.map((item:any) =>{
					data[`paidMemberDiscountItem${item.dictValue}`] = 1; //积分值
					data[`paidMemberDiscountItem${item.dictValue}Type`] = 1;  //积分值类型
				})
				item.paidMemberDiscountData = data;
			})
		}
	}
}

// 初始化表格数据
const getTemplateList = async () => {
	const params = {
		pageNum: 1,
		pageSize: 100,
	}
	const { results } = await freightTemplateList(params)
	state.freightTemplateList = results.records;
};

const previousStep = () => {
	emit('stepChange', 'seventh')
}

// 下一步
const nextStep = async (formEl: FormInstance | undefined) => {
	if (!formEl) return
	await formEl.validate((valid) => {
		if (valid) {
			emit('submitFun')
		} else {
			ElMessage.warning('请完善商品信息');
		}
	})
}

// 页面加载时
onMounted(() => {
	// 获取运费模板
	getTemplateList();
});
</script>


<style lang="scss" scoped>
.base-info-content {
	display: flex;
	flex-direction: column;
	flex: 1;
	height: inherit;
	.el-form{
		flex:1;
		overflow-y: auto;
		position: relative;
	}
}
</style>

